<template>
<div class="page">
    <div class="content">
        <classify-news :stockId="stockId"></classify-news>
        <div style="display: flex">
            <news-list></news-list>
            <div>
                <slide-show></slide-show>
                <RankingList></RankingList>
            </div>
        </div>
    </div>
</div>
</template>

<script setup>
    import ClassifyNews from "@/components/journalismPage/TopPart/classifyNews.vue";
    import NewsList from "@/components/journalismPage/bottomLeftPart/newsList.vue";
    import SlideShow from "@/components/journalismPage/bottomRightPart/slideShow.vue";
    import RankingList from "@/components/journalismPage/bottomRightPart/RankingList.vue";

    import {useRoute} from "vue-router";
    import {ref} from "vue";

    const  Route= useRoute();
    let stockId=ref(null)
    if(Route.query.stockId){
      stockId.value=Route.query.stockId
    }

</script>

<style scoped>
.page{
    background-color: #f6f6f6;
    width: 100%;
    height: 100%;
    padding-top: 1%;
}
.content{
    background-color: white;
    margin-left: 5%;
    margin-right: 4%;
    padding: 5px 11px 0 11px;
}
</style>